import { ACCESS_TOKEN } from '@/store/mutation-types'

const BlogDetail = {

  state: {
    blog: {
      'id': '',
      'userId': '',
      'nickName': '',
      'categoryName': '',
      'title': '',
      'starCount': '0',
      'commentCount': '0',
      'viewCount': '0',
      'top': '0',
      'createTime': '',
      'updateTime': '',
      'contentType': '1',
      'introduction': '',
      'coverUrl': '',
      'blogTagList': [],
      'content': '',
      'previousBlog': {},
      'nextBlog': {}
    },//博客详情信息
    treeOutline: { id: 'root', tag: 'root', text: 'root', parent: {}, children: [] },   //目录树形对象
    listOutline: [],                                                                    //目录列表对象
    openKeys: [],                                                                       //当前选中的路径节点
    selectedKeys: [],                                                                   //当前选中的叶子节点
    direction: 'down',                                                                   //当前选中的叶子节点
    activeOpenKeysType: 'window-scroll'                                                        //目录点击:outline-click,滚动激活:wiindow-scroll
  },

  actions: {
    /**
     * 设置博客详情页面的博客信息
     * @param commit
     * @param blogId 博客编号
     */
    setBlogDetail({ commit }, { blog }) {
      commit('SET_BLOG', blog)
    },
    /**
     * 设置当前文档滚动方向
     * @param commit
     * @param direction 滚动方向:up,down
     */
    setDirection({ commit }, direction) {
      commit('SET_DIRECTION', direction)
    },
    /**
     * 目录销毁处理
     * @param commit
     * @param activeType 激活类型：outline-click,window-scroll
     */
    setActiveOpenKeysType({ commit }, activeOpenKeysType) {
      commit('SET_ACTIVE_OPENKEYS_TYPE', activeOpenKeysType)
    },
    /**
     * 目录销毁处理
     * @param commit
     */
    destroyOutline({ commit }) {
      commit('DESTROY_OUTLINE', {})
    },
    /**
     * 激活博文目录
     * @param commit
     * @param args  预留参数
     */
    activeOutline({ commit }, args) {
      commit('SET_ACTIVE_OUTLINE', args)
    },
    /**
     * 设置选中的目录
     * @param commit
     * @param keys  选中的对象
     */
    setOpenKeys({ commit }, keys) {
      commit('SET_OPENKEYS', keys)
    },
    /**
     * 设置选中的目录
     * @param commit
     * @param keys  选中的对象
     */
    setSelectKeys({ commit }, keys) {
      commit('SET_SELECTKEYS', keys)
    },
    /**
     *  初始化目录数据
     * @param commit
     * @param treeOutline 树形目录对象
     * @param listOutline 列表目录对象
     */
    initOutlineData({ commit }, { treeOutline, listOutline }) {
      commit('SET_OUTLINE', { treeOutline, listOutline })
    }
  },

  mutations: {
    SET_BLOG: (state, blog) => {
      state.blog = blog
    },
    SET_DIRECTION: (state, direction) => {
      state.direction = direction
    },
    SET_ACTIVE_OPENKEYS_TYPE: (state, activeOpenKeysType) => {
      state.activeOpenKeysType = activeOpenKeysType
    },
    DESTROY_OUTLINE: (state) => {
      state.treeOutline = { id: 'root', tag: 'root', text: 'root', parent: {}, children: [] }
      state.listOutline = []
      state.openKeys = []
      state.selectedKeys = []
    },
    SET_ACTIVE_OUTLINE: (state, key) => {
      //没有目录数据
      if (state.listOutline.length === 0) return
      // 当通过点击目录时触发的文档滚动，不触发当前目录激活操作
      //if (state.activeOpenKeysType === 'outline-click') return
      //通过计算选取离顶部最近的目录进行激活
      const copyOutline = state.listOutline
      copyOutline.sort((a, b) => {
        let aDom = document.getElementById(a.id)
        let bDom = document.getElementById(b.id)
        if (aDom && bDom) {
          const offsetTopA = Math.abs(aDom.getBoundingClientRect().top)
          const offsetTopB = Math.abs(bDom.getBoundingClientRect().top)
          return offsetTopA - offsetTopB
        } else {
          return 0
        }

      })
      let minOutline = copyOutline[0]
      // const minOffsetTop = Math.abs(document.getElementById(minOutline.id).getBoundingClientRect().top)
      //值放大一点，可以让激活范围变大
      if (minOutline) {
        let selectPath = []
        while (minOutline.id != 'root') {
          selectPath.push(minOutline.id)
          minOutline = minOutline.parent
        }
        const len = selectPath.length
        //打开的父路径
        state.openKeys = selectPath.slice(1, len)
        //选中的菜单项
        state.selectedKeys = selectPath.slice(0, 1)
      }
    },
    SET_OPENKEYS: (state, key) => {
      state.openKeys = key
    },
    SET_SELECTKEYS: (state, keys) => {
      state.selectedKeys = keys
    },
    SET_OUTLINE: (state, { treeOutline, listOutline }) => {
      state.treeOutline = treeOutline
      state.listOutline = listOutline
    }
  }

}

export default BlogDetail
